<template>
    <z-range-picker v-model:value="value1" :ranges="ranges" />
    <br />
    <br />
    <z-range-picker
      v-model:value="value2"
      style="width: 400px"
      :ranges="ranges"
      show-time
      format="YYYY/MM/DD HH:mm:ss"
    />
</template>
<script>
import dayjs from 'dayjs';
import { defineComponent, ref } from 'vue';
export default defineComponent({
  setup() {
    return {
      value1: ref(),
      value2: ref(),
      ranges: {
        '今天': [dayjs(), dayjs()],
        '最近一周': [dayjs().subtract(7,'day'), dayjs()],
        '最近一月': [dayjs().subtract(1,'month'), dayjs()]
      },
    };
  },

});
</script>